/**
 * @file filter
 * @author liaoxuezhi@baidu.com
 */
/* eslint fecs-indent: [0, "space", 2, 2] */

import * as React from 'react';
import {
  Component,
  PropTypes
} from 'react';
import {Renderer, normalizeLink, filter} from '../renderer';
import * as cx from 'classnames';
import {Link} from 'react-router';
import OnExpression from '../hoc/on-expression';
import {isAmisSite} from '../../util/helper';

@Renderer({
  name: 'nav-item',
  desc: '...',
  test: (path, config) => /(?:^|\/)nav\/item$/.test(path)
})
@OnExpression
export default class NavigationItem extends Component {
  static propTypes = {
    className: PropTypes.string,
    to: PropTypes.string.isRequired
  };

  static contextTypes = {
    router: PropTypes.object
  };


  static defaultProps = {
    className: ''
  };

  render() {
    const {
      className,
      to,
      icon,
      label,
      active,
      disabled,
      overrideParams,
      data
    } = this.props;

    const router = this.context.router;
    const finalTo = normalizeLink(filter(to, data), undefined, overrideParams);
    const isActive = router && router.isActive(finalTo);

    return (
      <li
        className={cx(className, {
          active: active || isActive,
          disabled
        })}
      >
        {isActive ? (
          <a>
            {icon ? (<i className={cx(icon, 'm-r-xs')} />) : null}
            {label}
          </a>
        ) : /^http/.test(finalTo) ? (
          <a href={finalTo} target="_blank">
            {icon ? (<i className={cx(icon, 'm-r-xs')} />) : null}
            {label}
          </a>
        ) : isAmisSite() ? (
          <Link to={finalTo}>
            {icon ? (<i className={cx(icon, 'm-r-xs')} />) : null}
            {label}
          </Link>
        ) : (
          <a href={finalTo}>
            {icon ? (<i className={cx(icon, 'm-r-xs')} />) : null}
            {label}
          </a>
        )}
      </li>
    );
  }
}
